/* transition name="fade" mode="out-in" */
.fade-enter-active {
  animation: fade-in 0.3s;
}

.fade-leave-active {
  animation: fade-in 0.1s reverse;
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

/** REM布局 结束 **/
/**
 * 功能：单行、多行文本的溢出显示省略号
 * 添加`class="hidden1"`  1行溢出出现省略号
 * 添加`class="hidden2"`  2行溢出出现省略号
 * ...
 * 添加`class="hidden5"`  5行溢出出现省略号
 */
.hidden2,
.hidden3,
.hidden4,
.hidden5 {
  display: -webkit-box;
  /* autoprefixer:off */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.hidden1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hidden2 {
  -webkit-line-clamp: 2;
}

.hidden3 {
  -webkit-line-clamp: 3;
}

.hidden4 {
  -webkit-line-clamp: 4;
}

.hidden5 {
  -webkit-line-clamp: 5;
}

/**
 * 功能：清除浮动特性
 * 添加`class="clearfix"`
 */
.clearfix::after,
.clearfix::before {
  content: '';
  width: 0;
  height: 0;
  display: block;
  clear: both;
}
